<template>
  <p-drawer
    placement="right"
    :closable="false"
    width="calc(100vw - 200px)"
    :visible="visible"
    :mask-closable="false"
    :destroy-on-close="true"
    :z-index="1000"
    @close="onClose"
  >
    <TaskTitle title-name="编辑法人" color="blue" icon-name="Edit" />
    <div v-if="getFormData && formData.id" class="g-drawer-list-container">
      <TitleSecondary title="基本信息" />
      <FormBasicCorporate ref="FormBasicInfo" :form-info="formData" />
    </div>
    <ButtonGroup
      class="g-drawer-footer"
      :options="footerButtons"
      @click="handleButtonClick"
    />
  </p-drawer>
</template>

<script>
import FormBasicCorporate from './FormBasicCorporate.vue';

import {
  postInsertOrUpdate,
  postInsertQueryDetail,
} from '@/api/customerApi.js';

import DrawerMixin from './mixin';

export default {
  components: {
    FormBasicCorporate,
  },
  mixins: [DrawerMixin],
  props: {
    corporateId: {
      type: Number,
      default: 1
    }
  },
  data() {
    return {
      formData: {}
    };
  },

  computed: {
    footerButtons() {
      return [
        {
          key: 'save',
          type: 'primary',
          label: '保存',
          auth: true,
        },
        {
          key: 'close',
          label: '返回',
        },
      ];
    },
    getFormData() {
      return Object.keys(this.formData).length || 0;
    },
  },
  watch: {
    visible: {
      handler(val) {
        if (val) {
          if (!this.corporateId) return;
          this.getInsertQueryDetail();
        }
      },
      immediate: true,
    },
  },
  created() {
    this.getInsertQueryDetail()
  },
  methods: {
    async getInsertQueryDetail() {
      const res = await postInsertQueryDetail(this.corporateId)
      this.formData = res?.data?.data || {}
    },
    onClose() {
      this.$emit('update:visible', false);
      this.$emit('fresh');
    },
    async submitData(data) {
      const valid = await this.$refs.FormBasicInfo.validate();

      if (!valid) return new Promise(() => {});
      if (valid) {
        return await postInsertOrUpdate({
          ...data,
        });
      }
    },
    // async getSubmit() {
    //   const data = this.$refs.FormBasicInfo.form;
    //   const result = await this.submitData(data, '2');
    //   if (result?.data?.code === 0) {
    //     this.$message.success('提交成功！');
    //   }
    //   this.closeCallback();
    // },
    async saveCallback() {
      const data = this.$refs.FormBasicInfo.form;
      console.log(data, '123')
      const result = await this.submitData(data);
      if (result?.data?.code === 0) {
        this.$message.success('保存成功！');
      }
      this.closeCallback();
    },
    closeCallback() {
      this.onClose();
    },
    handleButtonClick(key) {
      const fn = `${key}Callback`;
      this[fn] && this[fn]();
    },
  },
};
</script>
